<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
       <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
         <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
	String path = request.getContextPath();
	request.setAttribute("path", path);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>卓应商城</title>
		<link rel="stylesheet" type="text/css" href="${path}/common/css/indexcss/style.css">
		<script type="text/javascript" src="${path}/common/js/jquery-1.8.3.min.js" ></script>
		 <link rel="stylesheet" href="${path}/common/layui/css/layui.css" media="all">
		 <script type="text/javascript" src="${path}/common/layui/layui.js" ></script>
		
		
		<style type="text/css">
			.div-hidden{
				display:none;
				position: absolute;
				background:#FFFFFF;
				z-index:999;
				top:120px;
				width:250px;
			}
			
			.div-show{
				display: block;
			}
			.list-group-item-heading{
				font-size:12px;
				float:left;
				margin-left:30px;
				margin-top:1px;
			}
			.list-group-item{
				width:;
				height:50px;
			}
			.imgimg{
				width:250px;
				height:45px;
			}
			 
			.banner_x .search{
			line-height:40px; 
			}
			
		</style>
		<script type="text/javascript">
			$(document).ready(function(){
				$("#search-input").on("keyup",function(){
					//获取要搜搜的值
					var searchContent = $(this).val();
					
					if(searchContent==""){
						$(".search-msg-box").removeClass("div-show");
						return;
					}
					$.post(
							"/index/sousuo",//指向的的Action
							{"likeName":searchContent},
							function(data){
								$(".search-msg-box").addClass("div-show");
								$(".search-msg-box").empty();
								//遍历
								$.each(data,function(i,obj){
									/* \"http://localhost:8083/fileserver/wares/"+obj.imgA+"\" style=\"\" */
									$a = $("<a href=\"${path}/product/selectlike?likeName="+obj.waresName+"\" class=\"list-group-item\">"+
											"<div class=\"imgimg\"><img src =\"http://localhost:8083/fileserver/wares/"+obj.imgA+"\" style = \"float:left;width:40px;height:40px;margin-left:50px;\">"+
											"<span class=\"list-group-item-heading\">"+obj.waresName+"</span>"+
											"</div>"+
											"</a>");
									$(".search-msg-box").append($a);
								});
							},
							"json"
							
					);
					
				});
			});
		</script>
</head>
<body>
	<!-- start header -->
		<header>
			<div class="top center">
				<div class="left fl">
					<ul>
						<li><a href="/user/loginreg/index" target="_blank">JoinLabs商城</a></li>
						<li>|</li>
						<li><a href="">JYUI</a></li>
						<li>|</li>
						<li><a href="">游戏</a></li>
						<li>|</li>
						<li><a href="">多看阅读</a></li>
						<li>|</li>
						<li><a href="">云服务</a></li>
						<li>|</li>
						<li><a href="">金融</a></li>
						<li>|</li>
						<li><a href="/order/show">订单信息</a></li>
						<li>|</li>
						<li><a href="/user/userinfo">个人中心</a></li>
						<div class="clear"></div>
					</ul>
				</div>
				
				<div class="right fr">
					<div class="gouwuche fr"><a href="/shopcar/show">购物车</a></div>
					<div class="fr">
					
						<ul>
						
						<c:choose>
							<c:when test = "${empty sessionScope.user.userName}">
								<li><a href="/user/loginreg/login" target="_blank">登录</a></li>
								<li>|</li>
							</c:when>
							<c:otherwise>
								<li>${sessionScope.user.userName}</li>
								<li>|</li>
								<li><a href="/user/loginreg/zx" target="_parent" >注销</a></li>
								<li>|</li>
							</c:otherwise>
						</c:choose>
							<li><a href="">消息通知</a></li>
						</ul>
					</div>
					<div class="clear"></div>
				</div>
				<div class="clear"></div>
			</div>
		</header>
	<!--end header -->

<!-- start banner_x -->
		<div class="banner_x center">
			<a href="./index.html" target="_blank"><div class="logo fl"></div></a>
			<a href=""><div class="ad_top fl">
				<img src="${path}/common/imge/logo.jpg" style = "height:100%;width:100%">
			</div></a>
			<div class="nav fl">
				<ul>
				<li><a href="/product/showtype?tid=1">手机</a></li>
				<li><a href="/product/showtype?tid=2">数码</a></li>
				<li><a href="/product/showtype?tid=3">家电</a></li>
				<li><a href="/product/showtype?tid=4">家居</a></li>
				<li><a href="/product/showtype?tid=5">服饰</a></li>
				<li><a href="/product/showtype?tid=6">食品</a></li>
				<li><a href="/product/showtype?tid=7">图书</a></li>
				<li><a href="/product/showtype?tid=8">鞋子</a></li>
				<li><a href="/product/showtype?tid=9">首饰</a></li>
				</ul>
			</div>
			<div class="search fr">
				<div class = "check">
					<div class="text fl">
						<input type="text" id="search-input" class="shuru"  placeholder="小米6&nbsp;小米MIX现货">
					</div>
					<div class="submit fl">
						<input type="button" class="sousuo" value="搜索"/>
					</div>
				</div>
						
				<div class="search-msg-box div-hidden">
				<center>
					<a href="#" class="list-group-item">
						<h6 class="list-group-item-heading">项目</h6>
					</a>
				</center>		
				</div>
				
			</div>
		</div>
<!-- end banner_x -->

	<!-- start banner_y -->
		<div class="banner_y center">
			<div class="nav" style = "float:left">				
				<ul>
					<li><a href="/product/fytype">全部商品分类</a></li>
					<li>
						<a href="/product/showtype?tid=1">手机</a>
					</li>
					
					<li>
						<a href="/product/showtype?tid=2">数码</a>
					</li>
					
					<li>
						<a href="/product/showtype?tid=3">家电</a>
					</li>
					
					<li>						
						<a href="/product/showtype?tid=4">家居</a>
					</li>
					
					<li>				
						<a href="/product/showtype?tid=5">服饰</a>
					</li>
					
					<li>		
						<a href="/product/showtype?tid=6">食品</a>
					</li>
					
					<li>						
						<a href="/product/showtype?tid=7">图书</a>
					</li>
					
					<li>						
						<a href="/product/showtype?tid=8">鞋子</a>
					</li>
					
					<li>	
						<a href="/product/showtype?tid=9">首饰</a>
					</li>
					
				</ul>
			</div>
		
			<div style="float: left; width:992px;height:460px;position:absolute;z-index:-1;margin-left:234px;">
				<div class="layui-carousel lunbotu" id="test1">
				  <div carousel-item>
				    <div style = "width:100%;height:100%"><img src="${path}/common/imge/lunbo1.jpg" style="width:100%;height:100%;"></div>
				    <div style = "width:100%;height:100%"><img src="${path}/common/imge/lunbo2.jpg" style="width:100%;height:100%;"></div>
				    <div style = "width:100%;height:100%"><img src="${path}/common/imge/lunbo3.jpg" style="width:100%;height:100%;"></div>
				  </div>
				</div>
				<div style="width:992px;height:180px;">
					<a href="#"><img src="${path}/common/imge/logo.jpg" style="width:992px;height:180px;"></a>
				</div>
			</div>
		 
			<script src="/static/build/layui.js"></script>
			<script>
			layui.use('carousel', function(){
			  var carousel = layui.carousel;
			  carousel.render({
			    elem: '#test1'
			    ,width: '100%' 
			    ,arrow: 'always' 
			  });
			});
			</script>
				
		</div>	

		<div class="sub_banner center">
			<div class="sidebar fl">
				<div class="fl"><a href=""><img src="${path}/common/image/hjh_01.gif"></a></div>
				<div class="fl"><a href=""><img src="${path}/common/image/hjh_02.gif"></a></div>
				<div class="fl"><a href=""><img src="${path}/common/image/hjh_03.gif"></a></div>
				<div class="fl"><a href=""><img src="${path}/common/image/hjh_04.gif"></a></div>
				<div class="fl"><a href=""><img src="${path}/common/image/hjh_05.gif"></a></div>
				<div class="fl"><a href=""><img src="${path}/common/image/hjh_06.gif"></a></div>
				<div class="clear"></div>
			</div>
			<div class="datu fl"><a href="/product/pro?pid=4"><img src="${path}/common/image/hongmi4x.png" alt=""></a></div>
			<div class="datu fl"><a href="/product/pro?pid=6"><img src="${path}/common/image/xiaomi5.jpg" alt=""></a></div>
			<div class="datu fr"><a href="/product/pro?pid=19"><img src="${path}/common/image/pinghengche.jpg" alt=""></a></div>
			<div class="clear"></div>


		</div>
	<!-- end banner -->
	<div class="tlinks">Collect from <a href="http://www.cssmoban.com/" >企业网站模板</a></div>

	<!-- start danpin -->
		<div class="danpin center">
			
			<div class="biaoti center">卓应名气单品</div>
			<div class="main center">
				<div class="mingxing fl">
					<div class="sub_mingxing"><a href="/product/pro?pid=33"><img src="http://localhost:8083/fileserver/wares/clqy/clqy1.png" alt=""></a></div>
					<div class="pinpai"><a href="/product/pro?pid=33">库里真品球衣</a></div>
					<div class="youhui">勇士库里NBA球衣</div>
					<div class="jiage">599元起</div>
				</div>
				<div class="mingxing fl">
					<div class="sub_mingxing"><a href="/product/pro?pid=67"><img src="http://localhost:8083/fileserver/wares/tge/tge1.png" alt=""></a></div>
					<div class="pinpai"><a href="/product/pro?pid=67">泰戈尔</a></div>
					<div class="youhui">教育部统推荐阅读丛书</div>
					<div class="jiage">24元</div>
				</div>
				<div class="mingxing fl">
					<div class="sub_mingxing"><a href="/product/pro?pid=34"><img src="http://localhost:8083/fileserver/wares/zmsqy/zmsqy1.png" alt=""></a></div>
					<div class="pinpai"><a href="/product/pro?pid=34">詹姆斯球衣</a></div>
					<div class="youhui">Nike 湖人队 詹姆斯球衣</div>
					<div class="jiage">599元</div>
				</div>
				<div class="mingxing fl"> 	
					<div class="sub_mingxing"><a href="/product/pro?pid=76"><img src="http://localhost:8083/fileserver/wares/zmhjdz/zmhjdz1.png" alt=""></a></div>
					<div class="pinpai"><a href="/product/pro?pid=76">周大福字母黄金吊坠</a></div>
					<div class="youhui">周大福字母转运珠足金黄金吊坠</div>
					<div class="jiage">487元</div>
				</div>
				<div class="mingxing fl">
					<div class="sub_mingxing"><a href="/product/pro?pid=11"><img src="http://localhost:8083/fileserver/wares/xiaomipc/xiaomipcb.png" alt=""></a></div>
					<div class="pinpai"><a href="/product/pro?pid=11">游戏笔记本</a></div>
					<div class="youhui">更轻更薄，像杂志一样随身携带</div>
					<div class="jiage">3999元起</div>
				</div>
				<div class="clear"></div>
			</div>
		</div>
		<div class="peijian w">
			<div class="biaoti center">猜您所想</div>
			<div class="main center">
				<div class="content">
					<div class="remen fl"><a href="/product/showtype?tid=4"><img src="${path}/common/image/peijian1.jpg"></a>
					</div>
					<div class="remen fl">
						<div class="xinpin"><span>新品</span></div>
						<div class="tu"><a href="/product/pro?pid=25"><img src="http://localhost:8083/fileserver/wares/xmej/xmej1.jpg" style="width:150px;"></a></div>
						<div class="miaoshu"><a href="/product/pro?pid=25">Redmi AirDots蓝牙耳机</a></div>
						<div class="jiage">99元</div>
						<div class="pingjia">4人评价</div>
						<div class="piao">
							<a href="">
								<span>帅到不谈</span>
								<span>来至于mi狼牙的评价</span>
							</a>
						</div>
					</div>
					<div class="remen fl">
						<div class="xinpin"><span style="background:#fff"></span></div>
						<div class="tu"><a href="/product/pro?pid=49"><img src="http://localhost:8083/fileserver/wares/szssgg/szssgg1.png" style="width:150px;"></a></div>
						<div class="miaoshu"><a href="/product/pro?pid=49">三只松鼠果干</a></div>
						<div class="jiage">49元</div>
						<div class="pingjia">12人评价</div>
					</div>
					<div class="remen fl">
						<div class="xinpin"><span style="background:red">享6折</span></div>
						<div class="tu"><a href="/product/pro?pid=80"><img src="http://localhost:8083/fileserver/wares/hjjz/hjjz1.png" style="width:150px;"></a></div>
						<div class="miaoshu"><a href="/product/pro?pid=80">周六福珍珠戒指</a></div>
						<div class="jiage">1392元</div>
						<div class="pingjia">2人评价</div>
						<div class="piao">
							<a href="">
								<span>帅到不谈</span>
								<span>来至于mi狼牙的评价</span>
							</a>
						</div>
					</div>
					<div class="remen fl">
						<div class="xinpin"><span style="background:#fff"></span></div>
						<div class="tu"><a href="/product/pro?pid=70"><img src="http://localhost:8083/fileserver/wares/addslqx/addslqx1.png" style="width:150px;"></a></div>
						<div class="miaoshu"><a href="/product/pro?pid=70">阿迪达斯跑步鞋</a></div>
						<div class="jiage">569元</div>
						<div class="pingjia">2人评价</div>
						<div class="piao">
							<a href="">
								<span>帅到不谈</span>
								<span>来至于mi狼牙的评价</span>
							</a>
						</div>
					</div>
					<div class="clear"></div>
				</div>
				<div class="content">
					<div class="remen fl"><a href="/product/pro?pid=17"><img src="${path}/common/image/peijian6.png"></a>
					</div>
					<div class="remen fl">
						<div class="xinpin"><span style="background:#fff"></span></div>
						<div class="tu"><a href="/product/pro?pid=15"><img src="http://localhost:8083/fileserver/wares/xiaomijqr/jqr1.jpg" style="width:150px;"></a></div>
						<div class="miaoshu"><a href="/product/pro?pid=15">扫地机器人</a></div>
						<div class="jiage">1499元</div>
						<div class="pingjia">1人评价</div>
						<div class="piao">
							<a href="">
								<span>帅到不谈</span>
								<span>来至于mi狼牙的评价</span>
							</a>
						</div>
					</div>
					<div class="remen fl">
						<div class="xinpin"><span style="background:#fff"></span></div>
						<div class="tu"><a href="/product/pro?pid=35"><img src="http://localhost:8083/fileserver/wares/owqy/owqy1.png" style="width:150px;height:150px"></a></div>
						<div class="miaoshu"><a href="/product/pro?pid=35">欧文球衣</a></div>
						<div class="jiage">569元</div>
						<div class="pingjia">2人评价</div>
					</div>
					<div class="remen fl">
						<div class="xinpin"><span style="background:#fff"></span></div>
						<div class="tu"><a href="/product/pro?pid=78"><img src="http://localhost:8083/fileserver/wares/xxhjdz/xxhjdz2.png" style="width:150px;height:150px"></a></div>
						<div class="miaoshu"><a href="/product/pro?pid=78">周大福天使黄金吊坠</a></div>
						<div class="jiage">2430元</div>
						<div class="pingjia">1人评价</div>
					</div>
					<div class="remenlast fr">
						<div class="hongmi"><a href="/product/pro?pid=2"><img src="${path}/common/image/hongmin4.png" alt=""></a></div>
						<div class="liulangengduo"><a href="/product/fytype"><img src="${path}/common/image/liulangengduo.png" alt=""></a></div>					
					</div>
					<div class="clear"></div>
				</div>				
			</div>
		</div>
		<footer>
			<div class="copyright">简体 | 繁体 | English | 常见问题</div>
			<div class="copyright">卓应培训机构</div>
		</footer>
</body>
</html>